<!--
 * @Author: your name
 * @Date: 2020-12-09 14:59:55
 * @LastEditTime: 2020-12-09 17:47:06
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \sende_nuxt\pages\personalCenter\accountDashboard\index.vue
-->
<template>
  <div class="accountDashboard">
    <div class="accountDashboard_information mb10">
        <h4 class="accountDashboard_title b size12 mb10">{{$t('Account Information')}}</h4>
        <div class="s12 accountDashboard_wrapper">
            <div class="accountDashboard_box spacing">
                <div class="accountDashboard_box_title plr10 b size12 spacing">{{$t('CONTACT INFORMATION')}}</div>
                <ul class="accountDashboard_box_content ptb20 plr10 spacing">
                    <li class="user_name mb10 size12">wang gao</li>
                    <li class="user_email mb10 size12">275284429@qq.com</li>
                </ul>
                <div class="accountDashboard_box_bottom plr10 spacing">
                    <nuxt-link class="edit underline size12" :to="{path: '/personalCenter/accountInformation'}">Edit</nuxt-link>
                    <nuxt-link class="change gradients size12" :to="{path: '/personalCenter/accountInformation', query: {type: 0}}">Change Password</nuxt-link>
                </div>
            </div>
            <div class="accountDashboard_box spacing">
                <div class="accountDashboard_box_title plr10 b size12 spacing">{{$t('NEWSLETTERS')}}</div>
                <ul class="accountDashboard_box_content ptb20 plr10 spacing">
                    <li class="li mb10 size12">You are subscribed to "General Subscription"</li>
                </ul>
                <div class="accountDashboard_box_bottom plr10 spacing">
                    <nuxt-link class="edit underline size12" :to="{path: '/personalCenter/accountInformation', query: {type: 1}}">Edit</nuxt-link>
                </div>
            </div>
        </div>
    </div>
    <div class="accountDashboard_address mb10">
        <h4 class="accountDashboard_title b size12 mb10">{{$t('Address Book')}} <nuxt-link :to="{path: '/personalCenter/addressBook', query: {type: 0}}">{{$t('Manage Addresses')}}</nuxt-link> </h4>
        <div class="s12 accountDashboard_wrapper">
            <div class="accountDashboard_box spacing">
                <div class="accountDashboard_box_title plr10 b size12 spacing">{{$t('DEFAULT BILLING ADDRESS')}}</div>
                <ul class="accountDashboard_box_content ptb20 plr10 spacing">
                    <li class="billing_name mb10 size12">wang gao</li>
                    <li class="billing_country mb10 size12">china</li>
                    <li class="billing_street mb10 size12">机场大道诚远大厦</li>
                    <li class="billing_street mb10 size12">wenzhou, <span class="zipCode">325100</span></li>
                    <li class="billing_countrys mb10 size12">China</li>
                    <li class="billing_mobile mb10 size12">T: 18334440006</li>
                </ul>
                <div class="accountDashboard_box_bottom plr10 spacing">
                    <nuxt-link class="edit underline size12" :to="{path: '/personalCenter/addressBook', query: {type: 1}}">Edit Address</nuxt-link>
                </div>
            </div>
            <div class="accountDashboard_box spacing">
                <div class="accountDashboard_box_title plr10 b size12 spacing">{{$t('DEFAULT SHIPPING ADDRESS')}}</div>
                <ul class="accountDashboard_box_content ptb20 plr10 spacing">
                    <li class="ship_name mb10 size12">wang gao</li>
                    <li class="ship_country mb10 size12">china</li>
                    <li class="ship_street mb10 size12">机场大道诚远大厦</li>
                    <li class="ship_street mb10 size12">wenzhou, <span class="zipCode">325100</span></li>
                    <li class="ship_countrys mb10 size12">China</li>
                    <li class="ship_mobile mb10 size12">T: 18334440006</li>
                </ul>
                <div class="accountDashboard_box_bottom plr10 spacing">
                    <nuxt-link class="edit underline size12" :to="{path: '/personalCenter/addressBook', query: {type: 2}}">Edit Address</nuxt-link>
                </div>
            </div>
        </div>
    </div>
    <div class="accountDashboard_orders">
        <h4 class="accountDashboard_title b size12">{{$t('Recent Orders')}} <nuxt-link to="/personalCenter/myOrders">{{$t('View All')}}</nuxt-link> </h4>
        <div class="s12 accountDashboard_wrapper size12">
        <el-table
            :data="tableData"
            style="width: 100%">
            <el-table-column
                prop="order"
                label="Order #"
                width="180">
            </el-table-column>
            <el-table-column
                prop="date"
                label="Date"
                width="180">
            </el-table-column>
            <el-table-column
                prop="shipTo"
                label="Ship To"
                width="180">
            </el-table-column>
            <el-table-column
                prop="orderTotal"
                label="Order Total">
            </el-table-column>
            <el-table-column
                prop="status"
                label="Status">
            </el-table-column>
            <el-table-column label="Action">
                <div class="viewOrder gradients pointer">View Order</div>
            </el-table-column>
        </el-table>
        </div>
    </div>
  </div>
</template>

<script>
export default {
    async asyncData({route}) {
        console.log('route :>> ', route);
        return {
            tableData: [{
                order: '000000050',
                date: '11/13/2020',
                shipTo: 'wang gao',
                orderTotal: '$321.95',
                status: 'pending',
            }, {
                order: '000000049',
                date: '11/13/2020',
                shipTo: 'wang gao',
                orderTotal: '$321.95',
                status: 'pending',
            }, {
                order: '000000048',
                date: '11/13/2020',
                shipTo: 'wang gao',
                orderTotal: '$321.95',
                status: 'pending',
            }, {
                order: '000000047',
                date: '11/13/2020',
                shipTo: 'wang gao',
                orderTotal: '$321.95',
                status: 'pending',
            }]
        }
    }
}
</script>

<style lang="scss" scoped>

</style>